.phone-model {
  .ant-modal-content {
    background-color: #0000;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0%);
  }

  .phone-model-content {
    position: relative;
    width: 300px;

    &__ct {
      position: absolute;
      top: 72px;
      left: 50%;
      z-index: 9;
      box-sizing: border-box;
      width: 280px;
      height: 528px;
      padding: 10px;
      overflow-y: auto;
      background-color: #fff;
      border-radius: 0 0 36px 36px;
      transform: translateX(-50%);
      overscroll-behavior-y: contain;

      img {
        max-width: 100% !important;
      }

      p {
        margin: 0;
      }

      &::-webkit-scrollbar {
        width: 6px;
        height: 8px; /* 横向滚动条高度 */
      }

      &::-webkit-scrollbar-thumb {
        background: rgba(90, 90, 90, 30%); /* 半透明灰色 */
        border-radius: 4px;
        transition: background 0.3s;
      }

      /* 悬停时滑块颜色加深 */
      &::-webkit-scrollbar-thumb:hover {
        background: rgba(90, 90, 90, 50%);
      }

      /* 滚动条轨道背景 */
      &::-webkit-scrollbar-track {
        background: transparent;
      }
    }

    &__phone {
      position: absolute;
      top: 0;
      z-index: 2;
      width: inherit;
    }

    &__nav {
      position: absolute;
      top: 0;
      left: 50%;
      z-index: 1;
      box-sizing: border-box;
      width: 283px;
      height: 72px;
      padding: 40px 50px 0;
      overflow-x: hidden;
      color: #555;
      font-weight: bold;
      font-size: 14px;
      white-space: nowrap;
      text-align: center;
      text-overflow: ellipsis;
      background: #f3f4f6;
      border-radius: 38px 38px 0 0;
      transform: translateX(-50%);
    }
  }
}
